<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="stylesheet" href="../../rsframe/plugins/jeasyui/extend/jquery-easyui-webexcel/webexcel.css"/>
    <link rel="stylesheet" href="../../rsframe/plugins/jeasyui/extend/jquery-easyui-webexcel/flexi-color-picker/themes.css"/>
    <script type="text/javascript" src="../../rsframe/commons/script/common.js"></script>

    <script src="../../rsframe/plugins/jeasyui/extend/jquery-easyui-webexcel/webexcel.js"></script>
    <script src="../../rsframe/plugins/jeasyui/extend/jquery-easyui-webexcel/webexcel-tool.js"></script>
    <script src="../../rsframe/plugins/jeasyui/extend/jquery-easyui-webexcel/webexcel-cell.js"></script>
    <script src="../../rsframe/plugins/jeasyui/extend/jquery-easyui-webexcel/webexcel-row.js"></script>
    <script src="../../rsframe/plugins/jeasyui/extend/jquery-easyui-webexcel/webexcel-col.js"></script>
    <script src="../../rsframe/plugins/jeasyui/extend/jquery-easyui-webexcel/webexcel-handler.js"></script>

    <script src="../../rsframe/plugins/jeasyui/extend/jquery-easyui-webexcel/flexi-color-picker/colorpicker.min.js"></script>
    <script>
        $(function () {
            var webExcel = $('#webExcel').webexcel({
                colCount: 30,//默认列数
                rowCount: 50,//默认行数
                cellDefault: {
                    borderSize: 1
                }
            });
            $('#insertButton').click(function () {
                var url = 'report-data.html';
                var dialog = $.easyui.showDialog({
                    href: url,
                    title: '编辑数据元',
                    width: 600,
                    height: 400,
                    cache: false,
                    modal: true,
                    onSave: function () {
                        var opts = webExcel.webexcel('options');
                        var sql = top.$('#dataElementSql').val();
                        var url = $.util.getRootPath() + '/DynamicReport/findSqlCols.json';
                        $.post(url, {sql: sql}, function (json) {
                            var excelData = webExcel.webexcel('getData');
                            var dataElement = excelData.dataElement;
                            var id = $.util.guid('N');
                            dataElement[id] = sql;
                            var contentData = excelData.contentData;
                            var data = [];
                            var colIndex = 0;
                            for (var key in json) {
                                var rowData = [];
                                var chooseCell = opts.chooseFirstCell;
                                if (chooseCell == null) {
                                    chooseCell = contentData[0][0];
                                }
                                var row = chooseCell.beginRow;
                                var col = chooseCell.beginCol;
                                var cell = contentData[row][colIndex + col];
                                cell.dataElementId = id;
                                cell.text = '{' + key + '}';
                                rowData.push(cell);
                                data.push(rowData);
                                colIndex++;
                            }
                            webExcel.webexcel('loadData', data);
                        });
                        dialog.dialog('close');
                    }
                });
            });
            $('#saveButton').click(function () {
                var prompt = $.messager.prompt('提示信息', '请输入报表名称', function (r) {
                    if (r) {
                        $('#reportName').val(r);
                        var excelData = webExcel.webexcel('getData');
                        var excelDataStr = $.util.parseJSONStr(excelData);
                        var url = $.util.getRootPath() + '/DynamicReport/saveReport.json';
                        var param = {id: $('#reportId').val(), name: r, content: excelDataStr};
                        $.post(url, param, function (json) {
                            if (json.success) {
                                alert('保存成功！');
                            }
                        });
                    }
                });
                prompt.find('.messager-input').val($('#reportName').val());
            });
        });
    </script>
</head>

<body>
<input id="reportId" title="" type="hidden"/>
<input id="reportName" title="" type="hidden"/>
<div class="easyui-toolbar" id="toolbarButton">
    <div>
        <a id="insertButton" class="easyui-linkbutton" data-options="iconCls:'icon-add'">插入数据元</a>
        <a id="saveButton" class="easyui-linkbutton" data-options="iconCls:'icon-save'">保存报表</a>
    </div>
</div>
<div id="webExcel"></div>
</body>

</html>